<!DOCTYPE html>
<html>
	<head>
		<title>User Center</title>
		<% include ../common/link %>
		<style>
		</style>
	</head>
	<body>
		<% include ../common/header %>
		<div class="container" style="margin-top:5%">
			<div class="col-md-5 text-center">
				<div class="form-group text-center">
					<h3>
						<label for="">User Avatar</label>
					</h3>
				</div>
				<div>
					<form class="form-horizontal" enctype="multipart/form-data" method="post" action="/util/uploadAvatar/<%=user._id%>">
						<div class="form-group">
								<img src="<%=(user.avatar==undefined?'/images/avatar.png':user.avatar)%>" style="width:200px;height:200px;margin:auto;border:1px solid"/>
						</div>
						<div class="form-group">
							<div class="col-md-5 text-right">
								<label class="form-label">Select new avatar</label>
							</div>
							<div class="col-md-4 text-left">
								<input type="file" name="file" required>
							</div>
						</div>
						<div class="form-group text-center">
							<input type="submit" value="Upload" class="btn btn-primary">
						</div>
					</form>
				</div>
			</div>
			<div class="col-md-5">
				<div>
					<form class="form-horizontal" method="post" action="/users/updateInfo">
						<input type="hidden" name="_id" value="<%=user._id%>">
						<div class="form-group text-center">
							<h3>
								<label for="">User Information</label>
							</h3>
						</div>
						<div class="form-group text-center">
							<div class="col-md-3 text-right">
								<label>User name</label>
							</div>
							<div class="col-md-7 text-left">
								<%=user.username%>
								<!--<input type="text" class="form-control" name="username" required value="<%=user.username%>">-->
							</div>
						</div>
						<div class="form-group text-center">
							<div class="col-md-3 text-right">
								<label>Sex</label>
							</div>
							<div class="col-md-7">
								<label class="radio-inline"><input type="radio" name="sex" value="1" required <%=(user.sex==1?'checked':'')%>>Male</input></label>
								<label class="radio-inline"><input type="radio" name="sex" value="2" required <%=(user.sex==2?'checked':'')%>>Female</input></label>
								<label class="radio-inline"><input type="radio" name="sex" value="3" required <%=(user.sex==3?'checked':'')%>>Secret</input></label>
							</div>
						</div>
						<div class="form-group text-center">
							<div class="col-md-3 text-right">
								<label>Age</label>
							</div>
							<div class="col-md-7">
								<input type="number" class="form-control" name="age" value="<%=user.age%>">
							</div>
						</div>
						<div class="form-group text-center">
							<div class="col-md-3 text-right">
								<label>Email</label>
							</div>
							<div class="col-md-7">
								<input type="email" class="form-control" name="email" value="<%=user.email%>">
							</div>
						</div>
						<div class="form-group text-center">
							<div class="col-md-3 text-right">
								<label>Phone</label>
							</div>
							<div class="col-md-7">
								<input type="text" class="form-control" name="phone" value="<%=user.phone%>">
							</div>
						</div>
						<div class="form-group text-center">
							<div class="col-md-3 text-right">
								<label>Mark</label>
							</div>
							<div class="col-md-7">
								<textarea name="mark" class="form-control" style="height:100px"><%= (user.mark==="" ? "This guy is lazy and wrote nothing." : user.mark)%></textarea>
							</div>
						</div>
						<div class="form-group text-center">
							<input type="submit" value="Save" class="btn btn-primary" />
						</div>
					</form>
				</div>
			</div>
		</div>
		<% include ../common/footer %>
	</body>
	<script type="text/javascript">
		
	</script>
</html>